﻿$(document).ready(function () {
    applySliderFilter();
    applyQuestionAnswer();
    applyImageHover();
    applyTextColorChange();
});

function applySliderFilter() {
    $(".banner-unactive").fadeOut(0);
    $("#banner-area-filter li").click(function () {
        if (!$(this).hasClass("active")) {
            var idSlider = $(this).attr("slider");
            $(this).siblings().removeClass("active").css("color", "#b3dcd6");
            $(this).addClass("active");

            $(".banner-active").fadeOut(500, function() {
                $(this).removeClass("banner-active");
                $("#" + idSlider).fadeIn(500).addClass("banner-active");
            });
        }
    });
}

function applyQuestionAnswer() {
    var currentQuestion = $("#questions li.active span").text();
    $(".contentQuestion[question=" + currentQuestion + "]").slideDown();

    $("#questions li").click(function () {
        $(this).addClass("active").siblings().removeClass("active");
        var question = $(this).find("span").text();
        $(".contentQuestion[question=" + question + "]").slideDown().siblings().slideUp();
    });

}

function applyTextColorChange() {
    textColorChange($("#navigation li a, #banner-area-filter li, #footer-nav li, #footer-nav li a"), "#b3dcd6", "#fff");
}

function applyImageHover() {
    imageHover($(".socialIcons img"), "40px", "50px");
}

function imageHover(img, originalPixel, zoomPixel) {
    img.hover(function () {
        $(this).animate({ width: zoomPixel }, 200);
    }, function() {
        $(this).animate({ width: originalPixel }, 200);
    });
}

function textColorChange(text, currentColor, colorCode) {
    text.each(function () {
        $(this).hover(function () {
            if (!$(this).hasClass("active") && !$(this).parent().hasClass("active")) {
                $(this).animate({ color: colorCode }, 200);
            }
        }, function () {
            if (!$(this).hasClass("active") && !$(this).parent().hasClass("active")) {
                $(this).animate({ color: currentColor }, 200);
            }
        });
    }); 
}